ASP.NET 2.0 - MenuItems and hovering

Hello, I am currently attempting to modify an ASP.NET menu that I found online so that I will be better able to control the look and feel of menus that I create in the future. The current one that I am modifying is a simple "pop out" menu with a Horizontal orientation. If you compile that code that I am including in this post, you will see that when one hovers over the "main" ASP.NET Menu Items, there is a change in the color of "main" menu items (the menu items that are there when the page first renders and yield the "pop out" menu items);however, when one hovers over the MenuItems that pop out, I just can't seem to figure out how to make the color of the MenuItems change when they are hovered over unless I eliminate the background color property in the CSS code controlling the look of the "pop out" MenuItems. Can someone please tell me what code I need to add to be capable of creating an ASP.NET Menu with background colored "pop out" MenuItems that change color when hovered over? Any help would be greatly appreciated.

Here is the Code:

Expand|Select|Wrap|Line Numbers

 <%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head id="Head1" runat="server">

    <style type="text/css">

        .staticMenuItem

        {

            color:White;
 
            border:solid 1px black;

            padding:2px 4px;

        }

        .menuHover

        {

            color:#ffcc00;

            background-color:blue;

        }

        .dmenuHover

        {

            color:blue;

            background-color:#ff9900;

        }

        .dynamicMenuItem

        {

            color:black;

            background-color:#FF6600;

            padding:2px 4px;       

        }

        .dynamicMenu

        {

            background-color: #ffcc00;            

            border:Solid 1px black;

            filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='gray', Positive='true')" ;

        }

    </style>

    <title>Menu Desktop</title>

</head>

<body>

    <form id="form1" runat="server">

    <div>
 
    <asp:Menu

        id="Menu1"

        Orientation="Horizontal"

        StaticMenuItemStyle-CssClass="staticMenuItem"

        StaticHoverStyle-CssClass="menuHover"

        DynamicHoverStyle-CssClass="menuHover"

        DynamicMenuItemStyle-CssClass="dynamicMenuItem"

        DynamicMenuStyle-CssClass="dynamicMenu"

        Runat="server" BackColor="Red" DynamicMenuStyle-BackColor="#FF6600">

        <Items>

        <asp:MenuItem 

            Text="File"

            Selectable="False" Value="File">

            <asp:MenuItem 

                Text="Save" Value="Save" />

            <asp:MenuItem 

                Text="Open" Value="Open" />

        </asp:MenuItem>    

        <asp:MenuItem 

            Text="Format"

            Selectable="False" Value="Format">

            <asp:MenuItem 

                Text="Bold" Value="Bold" />

            <asp:MenuItem 

                Text="Italic" Value="Italic" />

            <asp:MenuItem 

                Text="Underline" Value="Underline" />

            <asp:MenuItem

                Text="Left Align" Value="Left Align" />

            <asp:MenuItem

                Text="Center Align" Value="Center Align" />            

            <asp:MenuItem

                Text="Right Align" Value="Right Align" />                

        </asp:MenuItem>    

        </Items>

        <StaticMenuItemStyle CssClass="staticMenuItem" />

        <DynamicHoverStyle CssClass="menuHover" />

        <DynamicMenuStyle CssClass="dynamicMenu" />

        <DynamicMenuItemStyle CssClass="dynamicMenuItem" />

        <StaticHoverStyle CssClass="menuHover" />

    </asp:Menu>    
 
    </div>

    </form>

</body>

</html>

Sep 12 '07 #1

Subscribe Post Reply

10225

cnixuser

I identified the problem in my code that was preventing the "pop out" menus from having a color change when hovered over, I had both the <asp:Menu> property for the Hovering background color and a CSS version of the same thing active at the same time, apparently, this caused some conflict from within the code. Here are the revisions to my code, I changed the colors around a bit for the hec of it, and I commented out the conflicting code in the CSS section of the code. Here is my revised code:

Expand|Select|Wrap|Line Numbers

 <%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >

<head id="Head1" runat="server">

    <style type="text/css">

        .staticMenuItem

        {

            color:White;
 
            border:solid 1px black;

            padding:2px 4px;

        }

        .menuHover

        {

            color:#ffcc00;

            background-color:red;

        }

        .dmenuHover

        {

            color:blue;

            background-color:#ff9900;

        }

        .dynamicMenuItem

        {

            color:black;

            /*background-color:#FF6600;*/

            padding:2px 4px;       

        }

        .dynamicMenu

        {

            /*the background color for the dynamic menus both "popout" and non is covered by the

            DynamicMenuStyle-BackColor="#FF6600" in the <asp:Menu> tag*/

            /*background-color: #ffcc00;*/

            /*background-color: green;*/            

            border:Solid 1px black;

            filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='gray', Positive='true')" ;

        }

    </style>

    <title>Menu Desktop</title>

</head>

<body>

    <form id="form1" runat="server">

    <div>

        &nbsp;<asp:Menu

        id="Menu1"

        Orientation="Horizontal"

        StaticMenuItemStyle-CssClass="staticMenuItem"

        StaticHoverStyle-CssClass="menuHover"

        DynamicHoverStyle-CssClass="menuHover"

        DynamicMenuItemStyle-CssClass="dynamicMenuItem"

        DynamicMenuStyle-CssClass="dynamicMenu"

        Runat="server" BackColor="Red" DynamicMenuStyle-BackColor="#FF6600">

        <Items>

        <asp:MenuItem 

            Text="File"

            Selectable="False" Value="File">

            <asp:MenuItem 

                Text="Save" Value="Save" />

            <asp:MenuItem 

                Text="Open" Value="Open" />

        </asp:MenuItem>    

        <asp:MenuItem 

            Text="Format"

            Selectable="False" Value="Format">

            <asp:MenuItem 

                Text="Bold" Value="Bold" />

            <asp:MenuItem 

                Text="Italic" Value="Italic" />

            <asp:MenuItem 

                Text="Underline" Value="Underline" />

            <asp:MenuItem

                Text="Left Align" Value="Left Align" />

            <asp:MenuItem

                Text="Center Align" Value="Center Align" />            

            <asp:MenuItem

                Text="Right Align" Value="Right Align" />                

        </asp:MenuItem>    

        </Items>

        <StaticMenuItemStyle CssClass="staticMenuItem" />

        <DynamicHoverStyle CssClass="menuHover" />

        <DynamicMenuStyle CssClass="dynamicMenu" />

        <DynamicMenuItemStyle CssClass="dynamicMenuItem" />

        <StaticHoverStyle CssClass="menuHover" />

    </asp:Menu>    
 
    </div>

    </form>

</body>

</html>

Also, here is the website where I got the original <asp:Menu> I was playing around with.

Sep 13 '07 #2

Similar topics

Dynamic MenuItems *weird* problem

by: Deutsche Dogge | last post by:

Hi. I'M having a weird problem with addign menuitems to a menu dynamically on the popup event of the menuitem containing the container of the menuitems i wanna add (tools -> external -> {list of...

.NET Framework

Adding Menuitems to Contextmenu doesn't work

by: Kreisquadratur | last post by:

Below is s snippet of my code, which should add menuitems as a submenu of an item in a contextmenu. But only the first time the contextmenu opens the entrys are set correctly. I just don't know why...

C# / C Sharp

Loop through MenuItems

by: Steve Tan | last post by:

1. How can I loop through all the items and subitems for Menu of a Windows Form (c#) ? Recursive function? 2. How can I uniquely identify a submenu item ? MenuItems doesn't have a Name...

C# / C Sharp

MDI Application MenuItems.Add Throws exception

by: Brian | last post by:

Create a simple MDI form and a child form, and try the following simple code to add a new menu item on the Edit menu popup: private void editMenu_Popup(object sender, System.EventArgs e) {...

C# / C Sharp

MenuItems.Clear() Problem

by: Davie | last post by:

I'm developing an application on the smartphone. To reduce the size of the application i'm using panels where appropriate instead of forms. As a result of the design, I need to have different...

C# / C Sharp

Iterate thru menuitems of a contextmenu

by: Jorge Cavalheiro | last post by:

Hello I am trying to browse thru all menuitens of contextmenus. The form has 3 contextmenus. mi and mi2 as menuitems, f is a form For Each mi In f.ContextMenu.MenuItems For Each mi2 In...

Visual Basic .NET

Menuitems do not display

by: active | last post by:

I have a mainmenu menuitem that contains a Recently Used Files menuitem If at design time I include a menuitem in the Recently Used Files menuitem collection it will display OK If I...

Visual Basic .NET

IE7 Issue - Footer Jumping Up Page When Hovering Over TopNav

by: Steve | last post by:

Hi there, I'm having a problem with a webpage where hoving over the top navigation links causes my footer to jump up to the centre of the page! It only happens with IE7, and works fine with the...

HTML / CSS

using tooltip on meny and menuitems

by: Tony | last post by:

Hello! Is it possible to use tooltip on menuStrip and toolstripmenuitem ? I mean that you get som kind of information when hovering over a menu or menyitem. How is that done? //Tony

C# / C Sharp

Migrating Website to Cloud - Emmanuel Katto

by: emmanuelkatto | last post by:

Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel

General

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

How to build RAID in BIOS?

by: Hystou | last post by:

There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...

Computer Hardware

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...

General

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...

Windows Server

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

C / C++

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

Career Advice

Couldn’t get equations in html when convert word .docx file to html file in C#.

by: conductexam | last post by:

I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...

C# / C Sharp